<#import "../tpl/htmlTep.ftl" as html>

<@html.htmlBase checkLogin=false >
<script src="${staticpath}/base/bui-admin/gVerify.js"></script>
<style>
    @media (min-width: 1024px) and (max-width: 1099px) {
        html,body {
            font-size: 18px!important;
        }
        .login-wrapper{
            height: 23rem;
        }
    }

    @media (min-width: 1100px)and (max-width: 1279px) {
        html,body {
            font-size: 20px!important;;
        }
        .login-wrapper{
            height: 23rem;
        }
    }

    @media (min-width: 1280px) and (max-width: 1365px) {
        html,body {
            font-size: 22px!important;;
        }
        .login-wrapper{
            height: 23rem;
        }
    }

    @media (min-width: 1366px) and (max-width: 1439px) {
        html,body {
            font-size: 24px!important;;
        }
        .login-wrapper{
            height: 23rem;
        }
    }
    @media (min-width: 1440px) and (max-width: 1679px) {
        html,body {
            font-size: 25px!important;;
        }
        .login-wrapper{
            height: 24rem;
        }
    }

    @media (min-width: 1680px) and (max-width: 1918px) {
        html,body {
            font-size: 28px!important;;
        }
        .login-wrapper{
            height: 29rem;
        }
    }

    @media (min-width: 1919px) {
        html,body {
            font-size: 33px!important;;
        }
        .login-wrapper{
            height: 27rem;
        }
    }
    .bui-message-content{
        font-size: 20px;
    }
</style>
<body class="login">
<div class="login-title">
    信阳平桥区智能采砂监控系统平台
</div>
<div class="login-wrapper flex middle">
    <div class="name cell-main">综合监控、统计报表、资产管理系统</div>
    <div class="login-table">
        <form class="form-horizontal ">
        <div class="login-in mb">登录</div>
        <div class="inp-box flex mb">
            <i class="iconfont  icon-yonghu loginicon"></i>
            <input type="text" class=" inp username cell-main" name="username" placeholder="请输入账号" />
        </div>
        <div class="inp-box flex mb">
            <i class="iconfont  icon-mima loginicon"></i>
            <input type="password" class=" inp password cell-main "  name="password" placeholder="请输入密码" />
        </div>
        <div class="flex  middle">
            <input type="text" id="code_input" class="codeinp"  value="" placeholder="请输入验证码" />
            <span id="v_container" class=" mr10"></span>
        </div>
         <#if errorMsg??>
            <span class="error-tips f14"><i class="iconfont icon-jinggao"></i> ${errorMsg}</span>
         </#if>
           <div class="login-btn">登录</div>

        </form>
    </div>

</div>
<div class="end f18 center">
    Copyright © 2015-2018 All Rights Reserved.
</div>
</body>
<script type="text/javascript">
    var verifyCode = new GVerify("v_container");
    $(function(){
        document.onkeydown = function (event) {
            var e = event || window.event;
            if (e && e.keyCode == 13) {
                $('.login-btn').click();
            }
        };
        $('.login-btn').click(function(){
            var username=$('.username').val();
            var password=$('.password').val();
            var code= $('#code_input').val();
            var res = verifyCode.validate($('#code_input').val());
            if(!username||!password||!code){
                BUI.Message.Alert('请填写完整信息', 'error');
            }else if (!res) {
                BUI.Message.Alert('验证码错误', 'error');
            } else {
                loginin()
            }
        })
    });
    function loginin() {
        var form = document.forms[0];
        form.action = "${basepath}/rest/manage/user/login";
        form.method = "post";
        form.submit();
    }
</script>
</@html.htmlBase>
